<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    对象.innerText属性：忽略元素内部的HTML标签，只返回文本内容(不解析 HTML 标签)
    对象.innerHTML属性：返回元素内部包含 HTML 标签的完整内容(会解析 HTML 标签)
    <div class="box">我是文本内容</div>
    <script>
        // 获取元素
        const box = document.querySelector('.box')
        // 修改文本内容，如果字符串中包含标签，不会被解析，对象.innerText属性
        console.log(box.innerText)  // 获取文本内容并打印
        box.innerText = '我是新文本内容'  // 修改文本内容
        console.log(box.innerText)
        // 修改文本内容，如果字符串中包含标签，会被解析为 HTML 并渲染，对象.innerHTML属性
        console.log(box.innerHTML)
        box.innerHTML = '<strong>加粗后的文本</strong>'  // 相当于在 div 标签内部包含了一个 strong 标签
        console.log(box.innerHTML)
        console.log(box.innerText)
    </script>
</body>

</html>